<template>
    <div class=''>
        <el-form
            :model="filterForm"
            label-width="70px"
        >
            <el-row>
                <el-col :span="6">
                    <el-form-item label="病理号">
                        <el-input
                            v-model="filterForm.pathologyId"
                            placeholder="请输入病理号"
                            clearable
                            class="picker-form"
                            size="mini"
                        >
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="分析状态">
                        <el-select
                            v-model="filterForm.analysisStatus"
                            placeholder="请选择分析状态"
                            clearable
                            class="picker-form"
                            size="mini"
                        >
                            <el-option
                                v-for="item in analysisStatusList"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="标本类别">
                        <el-select
                            v-model="filterForm.specimenType"
                            placeholder="请选择标本类别"
                            clearable
                            class="picker-form"
                            size="mini"
                        >
                            <el-option
                                v-for="item in specimenCategoryList"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id"
                            >
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="2">
                    <el-form-item label="">
                        <el-button
                            @click="search"
                            type="primary"
                            size="mini"
                        >搜索
                        </el-button>
                    </el-form-item>
                </el-col>
                <el-col :span="2">
                    <el-form-item label="">
                        <el-button
                            @click="refresh"
                            type="primary"
                            size="mini"
                        >刷新
                        </el-button>
                    </el-form-item>
                </el-col>
                <!-- <el-col :span="8">
                    <el-form-item label="">
                        <el-row>
                            <el-col :span="14">已分析:{{ aiMonitoringProgress.analysisOfCompleteCount }}
                                共计:{{ aiMonitoringProgress.total }}
                                平均耗时:{{
                                    aiMonitoringProgress.averageAnalysisTime == null ? 0 : aiMonitoringProgress.averageAnalysisTime
                                }}s
                            </el-col>
                            <el-col
                                :span="10"
                                style="height:40px;padding-top:10px"
                            >
                                <el-progress :percentage="parseInt(aiMonitoringProgress.completeProportionStr)"></el-progress>
                            </el-col>
                        </el-row>
                    </el-form-item>
                </el-col> -->

            </el-row>
        </el-form>
        <base-table
            ref="nlpTable"
            v-loading="!nlpTable.isReady"
            :data="nlpTable.data"
            :header="nlpTable.header"
            :operation="nlpTable.operation"
            :pageInfo="nlpTable.pageInfo"
            @handleClick="nlpTableButtonClick"
            @pageJumpTo="nlpTablePageJumpTo"
            @sizeChange="nlpTableSizeChange"
        >
        </base-table>
    </div>
</template>

<script>
import BaseTable from '@templates/components/BaseTable';
import { itemsPerPage } from '@/client/libs/util';
import { Enum, nlpScanStatus } from '@/client/consts/enum';

export default {
    name: 'DiagnosisScanNlpMonitoring',
    components: {
        BaseTable,
    },
    data() {
        return {
            // 所需字典对应表
            dictRequestMap: [
                {
                    code: 'specimenCategory',
                    arrayKey: 'specimenCategoryList',
                },
            ],
            specimenCategoryList: [],

            filterForm: {
                analysisStatus: '',
                specimenType: null,
                pathologyId: '',
            },
            analysisStatusList: [
                {
                    id: 0,
                    name: '未分析',
                },
                {
                    id: 1,
                    name: '分析完成',
                },
                {
                    id: 2,
                    name: '分析异常',
                },
            ],
            analysisType: {
                0: '门诊',
                1: '入院',
                2: '胃镜门诊',
                3: '胃镜入院',
            },

            aiMonitoringProgress: {},
            nlpTable: {
                isReady: false,
                data: [],
                header: [
                    {
                        label: '病理编号',
                        prop: 'pathologyId',
                    },

                    {
                        label: '姓名',
                        prop: 'name',
                    },
                    {
                        label: '性别',
                        prop: 'sexName',
                    },
                    {
                        label: '年龄',
                        prop: 'age',
                    },
                    {
                        label: '标本类别',
                        prop: 'specimenTypeName',
                    },
                    {
                        label: '传入数据号',
                        prop: 'dataId',
                    },
                    {
                        label: '分析状态',
                        prop: 'analysisStatus',
                        width: '130',
                        isRender: true,
                        render: (h, params) => {
                            const analysisStatus = new Enum(nlpScanStatus);
                            const _vm = this;
                            return h('div', [
                                h('span', [
                                    h(
                                        'span',
                                        {
                                            staticStyle: {
                                                color: analysisStatus.color(
                                                    params.row.analysisStatus
                                                ),
                                            },
                                        },
                                        analysisStatus.label(
                                            params.row.analysisStatus
                                        )
                                    ),
                                ]),
                            ]);
                        },
                    },
                    {
                        label: '分析时间',
                        prop: 'nlpModelCreateTime',
                        width: '150',
                    },
                    {
                        label: '患者HIS码',
                        prop: 'registrationId',
                    },
                    {
                        label: '患者ID',
                        prop: 'patientId',
                    },
                    {
                        label: '病历号',
                        prop: 'medicalRecordNumber',
                    },
                    {
                        label: '分析类型',
                        prop: 'typeName',
                    },
                ],

                operation: [],
                pageInfo: {
                    page: 1,
                    size: itemsPerPage.get(),
                    total: 0,
                },
            },
        };
    },
    mounted() {
        this.dictionariesRequest();
        this.nlpTableRequest();
    },
    computed: {},
    watch: {},
    methods: {
        // 请求字典信息
        dictionariesRequest() {
            this.dictRequestMap.forEach((map) => {
                this.$axios({
                    method: 'GET',
                    url: '/PROXY-Remote/dicts/list',
                    params: {
                        code: map.code,
                        page: 0,
                        size: 99,
                    },
                }).then((res) => {
                    if (res && res.data.code === 200) {
                        this[map.arrayKey] = _.clone(res.data.data);
                    }
                });
            });
        },
        nlpTablePageJumpTo(val) {
            this.nlpTable.pageInfo.page = val;
            this.nlpTableRequest();
        },
        nlpTableSizeChange(val) {
            this.nlpTable.pageInfo.size = val;
            this.nlpTableRequest();
        },
        nlpTableButtonClick(functionKey, row) {
            this[functionKey](row);
        },
        async nlpTableRequest() {
            this.nlpTable.isReady = false;
            // 过滤条件为已保存的 formTemp 中获取
            this.filterForm.size = this.nlpTable.pageInfo.size;
            this.filterForm.page = this.nlpTable.pageInfo.page - 1;

            const res = await this.$axios({
                method: 'POST',
                url: `/PROXY-Remote/diagnosis/findAll/NLPModelMonitoring`,
                data: this.filterForm,
            });

            if (res && res.data.code === 200) {
                // 请求成功
                const result = res.data;
                // 分页信息
                this.nlpTable.pageInfo = {
                    total: result.pageInfo.total,
                    page: result.pageInfo.page + 1,
                    size: result.pageInfo.size,
                };
                // 查询结果数据
                this.aiMonitoringProgress = result.aiMonitoringProgress;
                if (result.data) {
                    this.nlpTable.data = result.data;
                    this.nlpTable.data.forEach((item) => {
                        if (item.wondersCost === null) {
                            item.wondersCost = '';
                        } else {
                            item.wondersCost = item.wondersCost + 's';
                        }
                        item.typeName = this.analysisType[item.type];
                    });
                }
            } else {
                this.$message.warning('请求失败');
            }

            this.nlpTable.isReady = true;
        },
        search() {
            this.nlpTableRequest();
        },
        refresh() {
            this.nlpTableRequest();
        },
    },
};
</script>
<style scoped>
</style>
